/*@import 'https://cdn.jsdelivr.net/npm/@vue-flow/core@1.22.3/dist/style.css';*/
/*@import 'https://cdn.jsdelivr.net/npm/@vue-flow/core@1.22.3/dist/theme-default.css';*/
/*@import 'https://cdn.jsdelivr.net/npm/@vue-flow/controls@latest/dist/style.css';*/
/*@import 'https://cdn.jsdelivr.net/npm/@vue-flow/minimap@latest/dist/style.css';*/
/*@import 'https://cdn.jsdelivr.net/npm/@vue-flow/node-resizer@latest/dist/style.css';*/

/* these are necessary styles for vue flow */
@import "@vue-flow/core/dist/style.css";
@import "@vue-flow/core/dist/theme-default.css";

.vue-flow__minimap {
    transform: scale(75%);
    transform-origin: bottom right;
}

.basicflow {
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 4;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    height: calc(100vh - 160px);
}

.vue-flow__controls {
    box-shadow: 0 0 2px 1px #00000014
}

.vue-flow__controls-button {
    background: #fefefe;
    border: none;
    border-bottom: 1px solid #eee;
    box-sizing: content-box;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 16px;
    height: 16px;
    cursor: pointer;
    user-select: none;
    padding: 5px
}

.vue-flow__controls-button svg {
    max-width: 12px;
    max-height: 12px;
    overflow: visible
}

.vue-flow__controls-button:hover {
    background: #f4f4f4
}

.vue-flow__controls-button:disabled {
    pointer-events: none
}

.vue-flow__controls-button:disabled svg {
    fill-opacity: .4
}
